<?if($PAGE_ID$ == 'register')?>
<div class="uf-reg-wrap">
<div class="form-wrap">
<header class="form-title"><h1></h1></header>
<form id="uf-register" method="post" autocomplete="off" action="">
<div class="full-text sep-textarea" style="border-top: 1px dashed #CCC; border-bottom: 1px dashed #CCC; background-color: #f6f6f6 !important;">
<b>,    !</b><br>
         .
     ,   ,      .
<br>     ,   <a href="/index/0-3"></a> .<br>
<b>     . :</b><br>
<?if($SOCIAL_LOGIN$ && ($ONLY1STEP$ || $STEP$==1))?>
<div class="uf-soc-icons" align="center">
<?if($LOGIN_UID$)?>$LOGIN_UID$<?endif?>
<?if($LOGIN_FB$)?>$LOGIN_FB$<?endif?>
<?if($LOGIN_VK$)?>$LOGIN_VK$<?endif?>
<?if($LOGIN_GOOGLE$)?>$LOGIN_GOOGLE$<?endif?>
<?if($LOGIN_OK$)?>$LOGIN_OK$<?endif?>
<?if($LOGIN_YANDEX$)?>$LOGIN_YANDEX$<?endif?>
<?if($LOGIN_TWITTER$)?>$LOGIN_TWITTER$<?endif?>
</div>
<?endif?>
</div>
<div style="background-color: #f6f6f6 !important;">

<div class="uf-fields-wrap" style="margin-left: 30px;">
<?if($SOCIAL_LOGIN$ && ($ONLY1STEP$ || $STEP$==1))?><?endif?>
<?if($EMAIL$)?>
<div class="uf-field">
<label>Email</label>$EMAIL$
<span class="uf-status-icon text-field" id="uf-email-status-icon"><span class="uf-status"><i></i><p id="uf-email-status"></p></span></span>
</div>
<?endif?>

 <?if($PASSWORD$)?>
 <div class="uf-field">
 <label></label>$PASSWORD$
 <span class="uf-status-icon text-field" id="uf-password-status-icon"><span class="uf-status"><i></i><p id="uf-password-status"></p></span></span>
 <input type="checkbox" id="uf-show-pass" onchange="document.getElementById('uf-password').type = this.checked ? 'text' : 'password'">
 <label for="uf-show-pass"><span id="uf-show-pass-icon"></span></label>
 </div>
 <?endif?>

 <?if($NAME$)?>
 <div class="uf-field">
 <label></label>$NAME$
 <span class="uf-status-icon text-field" id="uf-name-status-icon"></span>
 </div>
 <?endif?>

 <?if($SURNAME$)?>
 <div class="uf-field">
 <label></label>$SURNAME$
 <span class="uf-status-icon text-field" id="uf-surname-status-icon"></span>
 </div>
 <?endif?>

 <?if($NICK$)?>
 <div class="uf-field">
 <label></label>$NICK$
 <span class="uf-status-icon text-field" id="uf-nick-status-icon"><span class="uf-status"><i></i><p id="uf-nick-status"></p></span></span>
 </div>
 <?endif?>

 <?if($BIRTHDAY$)?>
 <div class="uf-field">
 <label> </label>$BIRTHDAY$
 <span class="uf-status-icon" id="uf-birthday-status-icon"></span>
 </div>
 <?endif?>

 <?if($GENDER$)?>
 <div class="uf-field">
 <label></label>$GENDER$
 <span class="uf-status-icon" id="uf-gender-status-icon"></span>
 </div>
 <?endif?>

 <?if($LOCATION$)?>
 <div class="uf-field">
 <label> </label>$LOCATION$
 <span class="uf-status-icon" id="uf-location-status-icon"></span>
 </div>
 <?endif?>

 <?if($CAPTCHA$)?>
 <div class="uf-field">$CAPTCHA$
 <span class="uf-status-icon" id="uf-captcha-status-icon"><span class="uf-status"><i></i><p id="uf-captcha-status"></p></span></span>
 </div>
 <?endif?>

 <?if($TERMS$)?>
 <div class="uf-field">
 $TERMS$
 <span class="uf-status-icon" id="uf-terms-status-icon"></span>
 </div>
 <?endif?>

 <div id="uf-form-status"></div>
<div class="sep-submit"><button name="submit" class="fbutton" type="submit"><span>$SUBMIT$</span></button></div>
 </div>
 </form>
 <div style="clear:both"></div>
</div>
</div>
</div>

<style type="text/css">
input[type="password"] {display:block; width:97%; height:38px; line-height:38px; padding:0 15px;
color:#000000; background-color:#fff; border:1px solid #ccc; border-radius:3px;}
input[type="password"]:focus {background-color:#ffffff; border-color:#04a2dc; box-shadow:0 0 10px 0 rgba(4,162,220,0.5);}
.uf-reg-wrap { text-align: left; max-width: 100% !important; }
#uf-register .uf-field { margin: 15px 0 20px 0; white-space:nowrap; position:relative; }
#uf-register .uf-field>label { display:block; margin:3px 0; text-align:left }
#uf-register .uf-field input[type=text]:not([name=captcha]):not([name=code]) {width:97%; font-size:1em; padding-left:5px; padding-right:5px; }
#uf-register .uf-field img { vertical-align:middle;}
#uf-register input#uf-show-pass[type="checkbox"]{ display:none }
#uf-register input#uf-show-pass[type="checkbox"] + label span { display:inline-block; width:16px; height:16px; background:url(/.s/img/icon/social/pw.svg) no-repeat center center #c6c6c6; background-size:80% 80%; vertical-align:middle; margin-left:-23px; cursor:pointer; border-radius:10px }
#uf-register input#uf-show-pass[type="checkbox"] + label { display:inline-block }
#uf-register input#uf-show-pass[type="checkbox"]:checked + label span { background:url(/.s/img/icon/social/pw-s.svg) no-repeat center center #c6c6c6; background-size:80% 80% }
#uf-register .uf-changed input#uf-show-pass[type="checkbox"] + label span { margin-left:-38px;}
#uf-register .uf-status-icon { display:none; vertical-align:middle; width:16px; height:16px; background-repeat:no-repeat; background-size:cover; position:relative }
#uf-register .uf-status-icon.text-field { margin-left:-23px }
#uf-captcha-status-icon.uf-status-icon{position:absolute; left:105px; top:13px; }
#uf-captcha-img { width:125px; height:35px }
#uf-email-status-icon.fail, #uf-password-status-icon.fail, #uf-captcha-status-icon.fail { cursor:pointer }
#uf-register span.fail { display:inline-block; background-image:url(/.s/img/icon/social/fail.svg) }
#uf-register span.pass { display:inline-block; background-image:url(/.s/img/icon/social/pass.svg) }
#uf-register span.wait { display:inline-block; background-image:url(/.s/img/icon/ajsml.gif) }
#uf-register span.uf-status{ display:none; position:absolute; right:-15px; margin:0; z-index:5 }
#uf-register span.uf-status p { background-color:rgba(0,0,0,0.7); color:#fff; padding:5px 10px; white-space:nowrap; font:12px/29px 'Arial'; border-radius:3px; margin:6px 0 0 0; }
#uf-register span.uf-status i { float:right; margin-right:18px; display:block; width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-bottom:6px solid rgba(0,0,0,0.7) }
#uf-register .uf-refresh { cursor:pointer }
#uf-captcha { width:80px!important }
#uf-register .captcha img { vertical-align:middle }
#uf-register .uf-field input.uf-gender, #uf-register .uf-field input.uf-click { width:auto }
#uf-register .uf-field label.uf-inline-label, #uf-register .uf-field label#uf-terms-label { display:inline }
#uf-register .uf-fields-wrap, #uf-register .uf-soc-icons{ padding:1px 0 }
#uf-register .uf-soc-closeselect { display:none }
.uf-soc-icons ul { list-style-type:none; margin:0; padding:0 }
.uf-soc-icons ul li { width: 100%; margin: 2px 0; }
#uf-register .uf-soc-icons ul li b { display:block; position:absolute; left:0; padding-left:42px; top:8px; width:60px; font-weight:normal }

@media screen and (max-width:768px) {
 .uf-reg-wrap { text-align:center }
 a.login-with i { width:44px; height:44px; border-radius:24px;}
 #uf-register .uf-fields-wrap, #uf-register .uf-soc-icons { float:none; width:100%;text-align:center }
 #uf-register .uf-reg-wrap, #uf-register .uf-field label, #uf-register .uf-field { text-align:center }
 #uf-register .uf-soc-icons ul { margin:0 auto; overflow:auto; display:inline-block }
 #uf-register .uf-soc-icons ul li { width:auto; margin:5px }
 #uf-register .uf-soc-icons a.login-with b { display:none }
 #uf-register .uf-soc-closeselect { display:block }
 #uf-register .uf-soc-openselect { display:none }
 #uf-register .uf-field input { padding:10px 4%; font-size:120%; margin:0 auto }
 #uf-register input#uf-show-pass[type="checkbox"] + label span { margin-left:-38px }
 #uf-register .uf-changed input#uf-show-pass[type="checkbox"] + label span { margin-left:-60px;}
}
</style>
$JS_VALIDATOR$
<?endif?>

<?if($PAGE_ID$ == 'verify')?>
<div class="form-wrap">
<header class="form-title"><h1></h1></header>
<div class="berrors">
<b>   e-mail </b>
<br><div style="text-align:center; padding:20px;"> <b>$EMAIL$</b>        .<br>        .</div>
</div>
</div>
<?endif?>

<?if($PAGE_ID$ == 'confirm')?>
<h2> e-mail </h2>
<div style="text-align:center; padding:20px;">
 <?if($CONFIRM_ERROR$)?>
 $CONFIRM_ERROR$
 <?else?>
 !    e-mail 
 <?endif?>
 <br><br><a href="/"> </a>
</div>
<?endif?>